Issue

When manually entering a hex color code in the graph editor's color picker, the application would display an error message "something went wrong" instead of accepting the input.

Root Cause

The issue occurred because the hexToColor function was not handling errors when creating a Color object from an invalid or incomplete hex string. When the user was typing a value (which could be temporarily invalid during typing), this would cause an unhandled exception to be thrown.

Solution

Added proper validation and error handling in two key locations:

1. In the ColorField component:

   • Added a isValidHexColor function to validate hex color format
   • Enhanced onChange handler to validate input before conversion
   • Added try/catch blocks to handle conversion errors gracefully
   • Applied the same improvements to the delayed update handler

2. In the hexToColor utility function:

   • Added error handling to return a default color (black) instead of crashing
   • This provides a graceful fallback when conversion fails

Testing

Tested manually by entering various hex codes, including:

• Valid formats (e.g., #fff, #000000)
• Partial inputs during typing (e.g., #f, #ff)
• Invalid formats

The color picker now accepts valid input and gracefully handles invalid input without error messages.

Fixes #702.

💡 You can make Copilot smarter by setting up custom instructions, customizing its development environment and configuring Model Context Protocol (MCP) servers. Learn more Copilot coding agent tips in the docs.